// @ts-check
import {join} from 'path';
import forms from '@tailwindcss/forms';
// 1. Import the Skeleton plugin
import {skeleton} from '@skeletonlabs/tw-plugin';

/** @type {import('tailwindcss').Config} */
export default {
    // 2. Opt for dark mode to be handled via the class method
    darkMode: 'class',
    content: [
        "./index.html",
        "./src/**/*.{js,ts,jsx,tsx}",
        // 3. Append the path to the Skeleton package
        join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}'
        )
    ],
    theme: {
        extend: {},
    },
    plugins: [
        // 4. Append the Skeleton plugin (after other plugins)
        skeleton({
            themes: {
                preset: [
                    "skeleton", "wintry", "modern",
                    "rocket", "seafoam", "vintage",
                    "sahara", "hamlindigo", "gold-nouveau", "crimson",
                ]
            }
        }),
        forms,
    ],
}

